<!DOCTYPE html>
<!-- 网站主语言 -->
<html lang="zh-cn">

<head>
    <!-- 网站采用的字符编码 -->
    <meta charset="utf-8">
    <!-- 网站标题 -->
    <title> 写文章 </title>
    <!-- 引入bootstrap的css文件 -->
    <link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
    <!-- 引入monikai.css -->
    <link rel="stylesheet" href="md_css/monokai.css">
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">
    <!-- 引入vuejs -->
    <script type="text/javascript" src="js/vue-2.5.16.js"></script>
    <script type="text/javascript" src="js/axios-0.18.0.min.js"></script>
</head>

<body>
<div id="app">
<!-- 定义导航栏 -->
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
    <div class="container">
        <!-- 导航栏商标 -->
        <div>
            <a class="navbar-brand" href="./index.html">个人博客</a>
        </div>
    </div>
    <!--登录/个人中心-->
    <div class="navbar-collapse">
        <ul class="nav navbar-nav">
            <!-- 如果用户已经登录，则显示用户名下拉框 -->
            <li class="nav-item dropdown" v-if="is_login">
                <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" @click="show_menu_click">admin</a>
                <div class="dropdown-menu" aria-labelledby="navbarDropdown" style="display: block" v-show="show_menu">
                    <a class="dropdown-item" href="./write_blog.html">写文章</a>
                    <a class="dropdown-item" href='./center.html'>个人信息</a>
                    <a class="dropdown-item" href='#'>退出登录</a>
                </div>
            </li>
            <!-- 如果用户未登录，则显示登录按钮 -->
            <li class="nav-item" v-else>
                <a class="nav-link" href="./login.html">登录</a>
            </li>
        </ul>
    </div>
</nav>

<!-- 写文章表单 -->
<div class="container" style="margin-bottom: 20px">
    <div class="row">
        <div class="col-12">
            <br>
            <!-- 提交文章的表单 -->
            <form method="post" enctype="multipart/form-data">
                <!-- 文章标题图 -->
                <div class="form-group">
                    <label for="avatar">标题图</label>
                    <input type="file" class="form-control-file" name="avatar" id="avatar" >
                </div>

                <!-- 文章标题 -->
                <div class="form-group">
                    <!-- 标签 -->
                    <label for="title">文章标题</label>
                    <!-- 文本框 -->
                    <input type="text" class="form-control" id="title" name="title">
                </div>
                
                <!-- 文章栏目 -->
                <div class="form-group">
                    <label for="category">栏目</label>
                    <select class="form-control col-3" id="category" name="category">
                            <option value="none">请选择栏目..</option>
                        
                            <option value="1">Django</option>
                        
                            <option value="2">Java</option>
                        
                            <option value="3">HTML</option>
                        
                    </select>
                </div>

                <!-- 文章标签 -->
                <div class="form-group">
                    <!-- 标签 -->
                    <label for="tags">标签</label>
                    <!-- 文本框 -->
                    <input type="text" class="form-control col-3" id="tags" name="tags" >
                </div>
                <!-- 文章摘要 -->
                <div class="form-group">
                    <!-- 标签 -->
                    <label for="sumary">文章摘要</label>
                    <!-- 文本框 -->
                    <input type="text" class="form-control" id="sumary" name="sumary">
                </div>
                <!-- 文章正文 -->
                <div class="form-group">
                    <label for="body">文章正文</label>
                    <!-- 文本区域 -->
                    <!--<textarea type="text" class="form-control" id="body" name="body" rows="12"></textarea>-->
                    <textarea cols="40" id="id_body" name="content" rows="10" required data-processed="0" :data-config="data_config" data-external-plugin-resources="[]" data-id="id_body" data-type="ckeditortype">
                        </textarea>
                </div>
                <!-- 提交按钮 -->
                <button type="submit" class="btn btn-primary">完成</button>
            </form>
        </div>
    </div>
</div>

<!-- Footer -->
<footer class="py-3 bg-dark" id="footer">
    <div class="container">
        <h5 class="m-0 text-center text-white">Copyright @ qiruihua</h5>
    </div>
</footer>
</div>
<!--ckeditor-->
<script type="text/javascript" src="ckeditor/ckeditor-init.js" data-ckeditor-basepath="ckeditor/ckeditor/" id="ckeditor-init-script"></script>
<script type="text/javascript" src="ckeditor/ckeditor/ckeditor.js"></script>
<!-- 引入js -->
<script type="text/javascript" src="js/host.js"></script>
<script type="text/javascript" src="js/common.js"></script>
<script type="text/javascript" src="js/write_blog.js"></script>
</body>

</html>